<!--
 * @Author: 李九阳
 * @Date: 2021-12-13 20:42:12
 * @LastEditors: 李九阳
 * @LastEditTime: 2021-12-14 12:45:25
-->
<template>
  <!-- -->
  <!-- 拖拽指令
  <br />
  <div class="el-dialog" v-draggable></div>
  <br />
  设置水印文案，颜色，字体大小即可指令
  <br />
  <div
    v-waterMarker="{
      text: 'lzg版权所有',
      textColor: 'rgba(180, 180, 180, 0.4)',
    }"
  ></div>
  设置水印文案，颜色，字体大小即可指令
  <br />
  <div
    v-waterMarker="{
      text: 'lzg版权所有',
      textColor: 'rgba(180, 180, 180, 0.4)',
    }"
  ></div>
  <br /> -->
  v-permission 赋值判断即可
  <br />
  <div class="btns">
    <!-- 显示 -->
    <button v-permission="'1'">权限按钮1</button>
    <!-- 不显示 -->
    <button v-permission="'10'">权限按钮2</button>
  </div>
  <br />
  <!-- src 换成 v-LazyLoad
  <br />
  <img v-lazyLoad="'../../assets/login.svg'" />
  <br /> -->
  <!-- 将需要校验的输入框加上 v-emoji 即可
  <br />
  <input type="text" v-model="note" v-emoji />

  <br />
  给 Dom 加上 v-debounce 及回调函数即可
  <br />
  <button v-debounce="debounceClick">防抖</button>

  <br />
  给 Dom 加上 v-longpress 及回调函数即可
  <br />

  <button v-longpress="longpress">长按</button>
  <br />
  实现一键复制文本内容，用于鼠标右键粘贴
  <br />
  <button v-copy="copyText">复制</button> -->
</template>
<script lang="ts">
import { defineComponent, ref } from "vue";
import session from "@/store/sessionStorage";
export default defineComponent({
  name: "directive",
  setup() {
    const note = ref("");
    const copyText = ref("a copy directives");
    const debounceClick = () => {
      console.log("只触发一次");
    };
    session.setSession("directives", "测试");
    const longpress = () => {
      alert("长按指令生效");
    };
    return {
      note,
      debounceClick,
      longpress,
      copyText,
    };
  },
});
</script>
<style lang="scss" scoped></style>
